import config from '@/common/draw/config'
import useImage from '@/common/loadImages/loadImages'

import { AbstractCanvas } from './AbstractCanvas'

export class TowerCanvas extends AbstractCanvas {
  constructor(
    private canvas: HTMLCanvasElement,
    ctx: CanvasRenderingContext2D,
    private width: number,
    private height: number,
    private startY: number,
    private margin: number,
    private lst_towerConfig: TowerConfig[],
  ) {
    super(ctx)
    this.init()
  }

  // 初始化
  private init() {
    this.canvas.width = this.width
    this.canvas.height = this.height
    this.ctx.translate(this.margin, this.height - this.margin)
    this.ctx.translate(0, this.startY)
    this.ctx.scale(1, -1)
  }

  // 绘制铁塔
  public async draw() {
    // 加载图片
    const { image, loadImages } = useImage()
    await loadImages(config.tower)

    this.lst_towerConfig.forEach((tower) => {
      this.ctx.save()
      this.ctx.translate(tower.x, tower.y)
      this.drawTower(tower)
      this.drawTowerText(tower, image)
      this.ctx.restore()
    })
  }

  private drawTowerText(towerConfig: TowerConfig, image: Map<mapkey, HTMLImageElement>) {
    // 绘制名称
    this.ctx.save()
    this.ctx.scale(1, -1)
    this.ctx.translate(5, -40)
    // 绘制图片
    switch (towerConfig.tStyle) {
      case '耐张':
        super.drawImage(image.get('naizhang')!, [0, 0], 20, 20)
        break
      case '直线':
        super.drawImage(image.get('zhixian')!, [0, 0], 20, 20)
        break
      case '张力场':
        super.drawImage(image.get('zhanglichang')!, [0, 0], 20, 20)
        break
      case '牵引场':
        super.drawImage(image.get('qianyingchang')!, [0, 0], 20, 20)
        break
      default:
        break
    }
    // 绘制文字部分
    this.ctx.translate(25, 5)
    super.drawText(towerConfig.tName, [0, 0], 'black', 'left', 'middle')
    if (towerConfig.tType) {
      this.ctx.translate(0, 15)
      super.drawText(towerConfig.tType, [0, 0], '#333', 'left', 'middle')
    }
    this.ctx.translate(0, 15)
    super.drawText(Math.round(towerConfig.altitude) + 'm', [0, 0], '#8CABD9', 'left', 'middle')

    this.ctx.restore()
  }

  // 绘制塔
  private drawTower(towerConfig: TowerConfig) {
    const tStyle = towerConfig.tStyle
    switch (tStyle) {
      case '耐张':
        this.drawNaiZhangTower()
        break
      case '直线':
        this.drawZhiXianTower()
        break
      case '张力场':
        this.drawZhangLiChang()
        break
      case '牵引场':
        this.drawQianYingChang()
        break
      default:
        break
    }
  }

  //  绘制耐张塔
  private drawNaiZhangTower() {
    super.drawline([0, 10], [0, -20])
    super.drawline([-10, -5], [0, 0])
    super.drawline([0, 0], [10, -5])
  }

  //  绘制直线塔
  private drawZhiXianTower() {
    super.drawline([0, 10], [0, -20])
    super.drawline([-10, 0], [10, 0])
  }

  //  绘制张力场
  private drawZhangLiChang() {
    super.drawFillCircle([0, 0], 4, 'red')
    super.drawFillCircle([6, 0], 4, 'red')
    super.drawCircle([0, 0], 6, 'blue')
    super.drawCircle([6, 0], 6, 'blue')
  }

  //  绘制牵引场
  private drawQianYingChang() {
    super.drawFillCircle([0, 0], 4, 'red')
    super.drawCircle([0, 0], 6, 'blue')
  }
}
